import React from 'react';
import {
  View,
  Text,

} from 'react-native';

import Config from '../../config';
import SizeUtils from '../../common/SizeUtils';
import CommonStyles from '../../common/CommonStyles';
import {DateUtils} from '../../utils/Utils';
import TImage from '../../components/TImage';
import BaseItem from '../common/BaseItem';

export default class UserPostItemView extends BaseItem {
    render() {
        return (
            <View
              style={{backgroundColor:"#ffffff",
                  paddingTop:SizeUtils.translateDesignHeightToCode(30),
                  paddingBottom:SizeUtils.translateDesignHeightToCode(30),
                  borderColor:"#eeeeee", borderBottomWidth:SizeUtils.translateDesignNumToCode(2),
                }}>
                <View style={{flexDirection:"row",
                      width:(SizeUtils.getWindowSize().width - SizeUtils.translateDesignWidthToCode(80 + 4)),
                     alignItems:'center'}}>
                  <TImage source={this._getShowImageSource(this.props.data)}
                    style={{width:180, height:140}}/>
                  <View style={{flex:1, flexDirection: "column",
                    justifyContent:"space-between", paddingLeft:SizeUtils.translateDesignWidthToCode(20),
                    paddingRight:SizeUtils.translateDesignWidthToCode(20)}}>
                      <Text
                        style={[CommonStyles.primaryText, {fontSize:SizeUtils.translateFontSizeToCode(32),
                          backgroundColor:"#00000000", borderWidth:0}]}>
                          {this.props.data.title}
                      </Text>
                      <Text
                        style={[CommonStyles.secondaryText, {fontSize:SizeUtils.translateFontSizeToCode(26),
                            paddingTop:SizeUtils.translateDesignHeightToCode(50), backgroundColor:"#00000000", borderWidth:0}]}>
                          {this._getContent(this.props.data)}
                      </Text>
                  </View>
                </View>
            </View>
        );
    }

    _getShowImageSource(contentData) {
      if(contentData.image_urls && contentData.image_urls.length > 0) {
        return {uri: contentData.image_urls[0]};
      }
      else {
        return {uri: ""};
      }
    }

    _getContent(data) {
      var text = "";
      if(data.title) {
        text = text + data.readers_num + " 查看 · " + data.comments_num + " 评论 · " + DateUtils.formatDiffFromServerTime(data.posted_at);
      }
      return text;
    }
}
